<template>
	<view>
		<v-leaflet ref="myleafletwx"></v-leaflet>
	</view>
</template>

<script>
	var L = require('../../wxcomponents/zhgeo/leafletwx')
	import {createMap} from '../../wxcomponents/zhgeo/base.map'
	import {DefaultIcons} from '../../wxcomponents/zhgeo/config.js';
	L.RasterCoords = require('../../static/lib/mymap/rastercoords')
	const defaultIcons = new DefaultIcons();
	
	export default {
		data() {
			return {
				
			}
		},
		onLoad() {
			// const container = this.selectComponent('#gd-leafletwx')
			const container = this.$refs.myleafletwx
			let min_zoom = 1
			let max_zoom = 3
			let zoom = 1
			let img_width = 3000;   // 原始图片宽度
			let img_height = 2216;  // 原始图片高度
			createMap(container,   {
				crs: L.CRS.Simple,
				minZoom: min_zoom,
				maxZoom: max_zoom,
			  }, function(map) {
			  let img = [
				  img_width, // original width of image
				  img_height  // original height of image
			  ];
			  let rc = new L.RasterCoords(map, img);
			  map.setView(rc.unproject([img_width / 2, img_height / 2]), zoom);
			  L.tileLayer('../../static/tiles/mtiles/{z}/{x}/{y}.png', {
				noWrap: true,
				bounds: rc.getMaxBounds(),
				// maxNativeZoom: that.rc.zoomLevel()
			  }).addTo(map)
		
			  // 添加marker
			  let m = L.marker(rc.unproject([img_width / 2, img_height / 2]), {
				src: defaultIcons.locationNow,
				width: 32,
				height: 32,
				showInCenter: false,
			  }).addTo(map);
			  // 删除marer
			  // map.removeLayer( m );
			});
		},
		methods: {
			
		}
	}
</script>

<style>

</style>
